<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <script src="//cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
    <script src="//cdn.bootcss.com/oidc-client/1.4.1/oidc-client.min.js"></script>
    <!--var accounnt = { is_login: true };-->
    <script src="http://oidc-server.test/account/js"></script>
    <script type="text/javascript">
        var host = "http://oidc-client-js.test";

        var oidcOptions = {
            authority: 'http://oidc-server.test',
            client_id: 'oidc-client-js.test',
            post_logout_redirect_uri: host + '/index.html',
            redirect_uri: host + '/oidc/login-callback.html',
            silent_redirect_uri: host + '/oidc/refresh-token.html',
            accessTokenExpiringNotificationTime: 4,
            automaticSilentRenew: false,
            response_type: 'id_token token',
            scope: 'openid profile api-1 api-2 api-3',
            filterProtocolClaims: true
        };

        Oidc.Log.logger = console;

        console.log(account);
    </script>
</head>
<body>

    <fieldset>
        <legend>login/logout</legend>
        <a href="https://github.com/IdentityModel/oidc-client-js/wiki" target="_blank">oidc-client.js wiki</a>
        <br />
        <a href="javascript:login();">Login</a>
        <br />
        <a href="javascript:logout();">Logout</a>
    </fieldset>

    <fieldset>
        <legend>Use AccessToken Call API</legend>
        <a href="javascript:useAccessTokenCallAPI('http://oauth2-resources-aspnetcore.test');">
            http://oauth2-resources-aspnetcore.test
        </a>
        <br />
        <a href="javascript:useAccessTokenCallAPI('http://oauth2-resources-aspnetcore.test/books');">
            http://oauth2-resources-aspnetcore.test/books
        </a>
        <br />
        <a href="javascript:useAccessTokenCallAPI('http://oauth2-resources-owin.test');">
            http://oauth2-resources-owin.test
        </a>
        <br />
        <a href="javascript:useAccessTokenCallAPI('http://oauth2-resources-nodejs.test');">
            http://oauth2-resources-nodejs.test
        </a>
        <br />
        <a href="javascript:useAccessTokenCallAPI('http://oauth2-resources-java.test');">
            http://oauth2-resources-java.test
        </a>
        <br />
    </fieldset>


    <pre id="result" style="overflow-x: auto;"></pre>
    <script type="text/javascript">
        var manager = new Oidc.UserManager(oidcOptions);
        if (account.is_login) {
            getUser(function (user) {
                if (user) {
                    display(user);
                } else {
                    manager.signinRedirect();
                }
            });
        }

        manager.events.addUserLoaded(function () {
            getUser(display);
            console.log('UserLoaded：', arguments);
        });

        manager.events.addAccessTokenExpiring(function () {
            console.log('AccessTokenExpiring：', arguments);
        });

        manager.events.addAccessTokenExpired(function () {
            console.log('AccessTokenExpired：', arguments);
        });

        manager.events.addSilentRenewError(function () {
            console.error('SilentRenewError：', arguments);
        });

        manager.events.addUserSignedOut(function () {
            alert("已经退出！");
            console.log('UserSignedOut：', arguments);
            manager.removeUser();
            getUser(display);
        });

        function login() {
            getUser(function (user) {
                if (user) {
                    alert("已经登录！");
                } else {
                    loginCore();
                }
            });

        }

        function logout() {
            getUser(function (user) {
                if (!user) {
                    alert("已经注销！");
                } else {
                    logoutCore();
                }
            });
        }

        function useAccessTokenCallAPI(url) {
            getUser(function (user) {
                if (user) {
                    var accessToken = user.access_token;
                    $.ajax({
                        url: url,
                        headers: {
                            Authorization: "Bearer " + accessToken
                        },
                        dataType: "json",
                        success: display,
                        error: display
                    });
                } else {
                    alert("请先登录！");
                }
            });
        }

        function loginCore() {
            manager.signinRedirect()
                .catch(function (error) {
                    console.error('error while logging', error);
                });
        }

        function logoutCore() {
            manager.signoutRedirect()
                .catch(function (error) {
                    console.error('error while signing out user', error);
                });
        }

        function getUser(callback) {
            manager.getUser().then(callback);
        }

        function display(data) {
            if (data && typeof data === 'string') {
                data = JSON.parse(data);
            }
            if (data) {
                data = JSON.stringify(data, null, 2);
            }
            $("#result").text(data);
        }
    </script>
</body>
</html>
